<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Candy Color Button Animation</title>
		<link href="https://fonts.googleapis.com/css2?family=Lato&display=swap" rel="stylesheet">
		<link rel="stylesheet" href="./CandyColorBtn.css"/>
	</head>
	<body>
		<h1>Animation Buttons</h1>
		<p>Hover us and enjoy the satisfying neumorphic animation designs!</p>
		<div class="frame">
		  <button class="custom-btn btn-1">Read More</button>
		  <button class="custom-btn btn-2">Read More</button>
		  <button class="custom-btn btn-3"><span>Read More</span></button>
		  <button class="custom-btn btn-4"><span>Read More</span></button>
		  <button class="custom-btn btn-5"><span>Read More</span></button>
		  <button class="custom-btn btn-6"><span>Read More</span></button>
		  <button class="custom-btn btn-7"><span>Read More</span></button>
		  <button class="custom-btn btn-8"><span>Read More</span></button>
		  <button class="custom-btn btn-9">Read More</button>
		  <button class="custom-btn btn-10">Read More</button>
		  <button class="custom-btn btn-11">Read More<div class="dot"></div></button>
		  <button class="custom-btn btn-12"><span>Click!</span><span>Read More</span></button>
		  <button class="custom-btn btn-13">Read More</button>
		  <button class="custom-btn btn-14">Read More</button>
		  <button class="custom-btn btn-15">Read More</button>
		  <button class="custom-btn btn-16">Read More</button>
		  <p style="font-family: Andale Mono, monospace;">
		    DEERBUCKS.DESIGNING</p>
		</div>
	</body>
</html>